// 注册
import React, {useState, useEffect} from 'react';
import {
  View,
  Text,
  StyleSheet,
  StatusBar,
  Image,
  Alert,
  TextInput,
  Modal,
  Platform,
  PermissionsAndroid,
  ScrollView,
  TouchableHighlight
} from 'react-native';
import {windowWidth, windowHeight, getHeight, getWidth} from '@/utils/index';
import IconFont from '../../assets/iconfont';
import Touchable from '../../components/Touchable';
import TreeSelect, {LeafClickProps} from 'react-native-tree-select';
import cityData from '../../assets/cityData/city_data.json';
import Toast from 'react-native-root-toast';
import {launchImageLibrary} from 'react-native-image-picker';
// 连接到dva,react-redux本身充当一个桥梁的作用
import {connect, ConnectedProps} from 'react-redux';
import {RootState} from '@/models/index';
import AsyncStorage from '@react-native-async-storage/async-storage';
import {IUserInfo} from '@/models/user';
const mapStateToProps = ({users, loading}: RootState) => {
  return {
    currentUser1: users?.user,
    // 在触发getUserInfo方法时加上加载效果
    loading: loading.effects['users/editUserinfo'],
  };
};
// connect接受一个mapStateToProps函数，将dva的state映射成当前组件的props
const connector = connect(mapStateToProps);
type ModelState = ConnectedProps<typeof connector>;
interface IProps extends ModelState {
  navigation: {goBack: any; navigate: any};
  route:any
}

interface ICityData {
  id: string;
  name: string;
  sortNo: string;
  parentId: string;
  children?: ICityData[];
}
interface ITree {
  modalVisible: boolean;
  setModalVisible: Function;
  setSaveCity: Function;
}
interface FormData {
  user_id:string;
  username: string;
  age: string;
  city: string;
  scurpture: string;
  nature: string;
  // 身份有两种，一个是普通用户，一个是摄影师，默认为普通用户
  // identity:string;
  experience?: string;
  works?: {
    work_id: string;
    work_url: string;
  }[];
  newAddImages?:any[];
  // 用户身份为必传项，得根据用户身份辨别当前是否应该传experince和works,普通用户是没有这两项的
  // identity:string
}
const Tree = React.memo((props: ITree) => {
  const {setModalVisible, modalVisible, setSaveCity} = props;
  const onSaveCity = () => {
    console.log('点击了');
  };
  const onSaveCityLeaf = (p: LeafClickProps) => {
    setSaveCity(p.item.name);
    setModalVisible(false);
  };
  return (
    <Modal
      animationType="slide"
      transparent={true}
      visible={modalVisible}
      onRequestClose={() => {
        Alert.alert('Modal has been closed.');
        setModalVisible(!modalVisible);
      }}>
      <View style={styles.modalView}>
        <TreeSelect
          data={cityData.provinces as ICityData[]}
          // isOpen
          isShowTreeId={false}
          itemStyle={{
            fontSize: 12,
            // color: '#995962',
            color: '#999',
          }}
          selectedItemStyle={{
            fontSize: 14,
            color: 'black',
          }}
          onClick={onSaveCity}
          onClickLeaf={onSaveCityLeaf}
          treeNodeStyle={{
            openIcon: (
              <Image
                resizeMode="stretch"
                style={{width: 18, height: 18}}
                source={require('../../assets/localImage/login_image.png')}
              />
            ),
            closeIcon: (
              <Image
                resizeMode="stretch"
                style={{width: 18, height: 18}}
                source={require('../../assets/localImage/login_image.png')}
              />
            ),
          }}
        />
      </View>
    </Modal>
  );
});
const Register = (props: IProps) => {
  const {dispatch, navigation, currentUser1,route} = props;
  const [modalVisible, setModalVisible] = useState(false);
  const [modalVisiable1, setModalVisiable1] = useState<boolean>(false);
  const [deleteNewImageVisiable,setDeleteNewImageVisiable] = useState<boolean>(false);
  const [saveCity, setSaveCity] = useState(null);
  const [image, setImage] = useState<{uri: any}>({
    uri: currentUser1 && currentUser1[0].scurpture,
  });
  const [formData, setFormData] = useState<FormData>({
    user_id:route.params.user_id,
    username: currentUser1 && currentUser1[0].username?currentUser1[0].username: "",
    age: currentUser1 && currentUser1[0].age?(currentUser1[0].age).toString() : "",
    city: currentUser1 && currentUser1[0].city?currentUser1[0].city:"",
    scurpture: currentUser1 && currentUser1[0].scurpture?currentUser1[0].scurpture:"",
    nature: currentUser1 && currentUser1[0].nature?currentUser1[0].nature:"",
    experience:currentUser1 && currentUser1[0].experience ?(currentUser1[0].experience).toString():"",
    // 身份有两种，一个是普通用户，一个是摄影师，默认为普通用户
    // identity:currentUser1 && currentUser1[0].identity ?currentUser1[0].identity:""
  });
  const [workId,setWorkId] = useState<string>("");
  const [fileName,setFileName] = useState<string>("");
  const [works,setWorks] = useState<any[] | undefined>(currentUser1 && currentUser1[0].works);
  // 新增的图片
  const [newAddImages,setNewAddImages] = useState<any[]>([]);

  useEffect(() => {
    cityData.provinces.map((city: any, i: number) => {
      city.id = i.toString();
      city.sortNo = i.toString();
      city.parentId = i.toString();
      city.children &&
        city.children.map((cityItem: any, index: number) => {
          cityItem.id = i.toString() + '0' + index.toString();
          cityItem.sortNo = i.toString() + '0' + index.toString();
          cityItem.parentId = i.toString();
        });
    });
  }, []);
  const handlePressCity = () => {
    console.log(true);
    setModalVisible(true);
  };
  const handleAddPicCheck = () => {
    console.warn('添加图片------check');
    const options: any = {
      cameraType: 'back',
      mediaType: 'photo', // 媒体类型还可以是视频或者图片视频二者混合，默认选取一张
      videoQuality: 'high',
      durationLimit: 10,
      maxWidth: 720,
      maxHeight: 1280,
      quality: 1,
    };
    async function requestCameraPermission() {
      console.log('Platform.Version', Platform.Version);
      if ((Platform.Version as number) >= 31) {
        // 如果运行的是 Android 12 或更高版本，选用新模型来请求相机权限
        // const result = await requestPermissionAndroid12('android.permission.CAMERA');
        // 请求本地存储权限
        const result = await requestPermissionAndroid12(
          'android.permission.READ_EXTERNAL_STORAGE',
        );
        if (result === PermissionsAndroid.RESULTS.GRANTED) {
          console.log('加载权限');
          // launchCamera(options, (res)=>{
          //   console.log("res",res)
          // });
          //打开图库
          launchImageLibrary(options, ({assets}) => {
            console.log('res', assets);
            // res {"assets": [{"fileName": "rn_image_picker_lib_temp_00144087-1f0f-4d10-ae39-5ad9f2a02440.jpg", "fileSize": 232251, "height": 720, "type": "image/jpeg", "uri": "file:///data/user/0/com.xipai/cache/rn_image_picker_lib_temp_00144087-1f0f-4d10-ae39-5ad9f2a02440.jpg", "width": 720}]}
            if (assets && assets[0].uri) {
              setImage({uri: assets[0].uri});
            }
          });
          console.log('Camera permission granted权限通过');
        } else {
          console.log('Camera permission denied权限拒绝');
        }
      } else {
        // 如果运行的是 Android 11 或更低版本，使用之前的版本的权限请求模型来请求
        try {
          const granted = await PermissionsAndroid.request(
            // PermissionsAndroid.PERMISSIONS.CAMERA,
            PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
            {
              title: 'App android.permission.READ_EXTERNAL_STORAGE Permission',
              message:
                'App needs access to android.permission.READ_EXTERNAL_STORAGE.',
              buttonNeutral: 'Ask Me Later',
              buttonNegative: 'Cancel',
              buttonPositive: 'OK',
            },
          );
          if (granted === PermissionsAndroid.RESULTS.GRANTED) {
            console.log('Camera permission granted,11一下权限请求通过');
          } else {
            console.log('Camera permission denied,11一下权限请求失败');
          }
        } catch (err) {
          console.warn(err);
        }
      }
    }
    async function requestPermissionAndroid12(permission: any) {
      // 检查是否该应用被永久允许了相机权限android.permission.CAMERA
      const isGranted = await PermissionsAndroid.check(permission);
      if (isGranted) {
        // 如果设置的应用权限管理中用户允许了，直接返回许可令
        return PermissionsAndroid.RESULTS.GRANTED;
      }
      // 询问用户是否给权限，如果用户设置的是每次使用时询问
      const result = await PermissionsAndroid.request(permission);
      if (result === PermissionsAndroid.RESULTS.GRANTED) {
        console.log('yunxu');
        return PermissionsAndroid.RESULTS.GRANTED;
      } else if (result === PermissionsAndroid.RESULTS.NEVER_ASK_AGAIN) {
        throw new Error('Permission denied with never ask again');
      } else {
        throw new Error('Permission denied');
      }
    }

    requestCameraPermission();
  };

  const onChangeText = (text: string, name: string) => {
    console.log('name', name, 'text', text);
    let obj = {[name]: text};
    let newFormData = Object.assign(formData, obj);
    // const formData = new FormData();
    // formData.append('email', email);
    // formData.append('username', username);
    // formData.append('password', password);
    // formData.append('avatar', {
    //   uri: avatar.uri,
    //   name: 'avatar.jpg',
    //   type: 'image/jpeg',
    // });

    setFormData(newFormData);
  };
  const handleSubmit = () => {
    console.log('点击了提交', formData);
    if (
      !saveCity ||
      !image ||
      formData.nature.trim().length === 0 ||
      formData.username.trim().length === 0 ||
      formData.age.trim().length === 0
    ) {
      Toast.show('请把数据填写完整，选择图片作为头像再提交', {
        position: Toast.positions.CENTER,
        duration: Toast.durations.LONG,
        shadow: true,
        animation: true,
      });
      return;
    }
    let reg = /^\d+$/;
    if (!reg.test(formData.age)) {
      Toast.show('年龄必须为数字', {
        position: Toast.positions.CENTER,
        duration: Toast.durations.LONG,
        shadow: true,
        animation: true,
      });
      return;
    }
    if(currentUser1 && currentUser1[0].identity === "摄影师"){
      if (newAddImages.length === 0 && !works) {
        Toast.show('摄影师必须有摄影作品，请上传摄影作品', {
          position: Toast.positions.CENTER,
          duration: Toast.durations.LONG,
          shadow: true,
          animation: true,
        });
        return;
      }
    }

    let obj = {
      city: saveCity,
      scurpture: image.uri,
      works:works,
      newAddImages:newAddImages
    };
    // let obj1 = {
    //   works:works,
    //   newAddImages:newAddImages
    // }
    // let newFormData = currentUser1 && currentUser1[0].identity === "摄影师" ? Object.assign(formData, obj,obj1) :Object.assign(formData, obj) ;
    let newFormData = Object.assign(formData, obj);
    console.log('newFormData', newFormData);
    dispatch({
      type: 'users/editUserInfo',
      payload: {
        formData: newFormData,
        callback: (data:string) => {
          console.log("编辑详细用户信息成功了",data);
          dispatch({
            type: 'users/getCurrentUser',
            payload: {
              user_id: currentUser1 && currentUser1[0]._id ? currentUser1[0]._id : "",
              callback: (data:IUserInfo[]) => {
                data[0] &&   AsyncStorage.setItem('currentUserInfo', JSON.stringify(data[0]));
                Toast.show('编辑详细用户信息成功', {
                  position: Toast.positions.CENTER,
                  duration: Toast.durations.LONG,
                  shadow: true,
                  animation: true,
                });
                navigation.navigate("My");
              },
            },
          });
        },
      },
    })
    setFormData(newFormData);
  };

  const handlePickerImage = () => {
    console.log("handlePickerImage");
    console.warn('添加图片------check');
    const options: any = {
      cameraType: 'back',
      mediaType: 'photo', // 媒体类型还可以是视频或者图片视频二者混合，默认选取一张
      videoQuality: 'high',
      durationLimit: 10,
      maxWidth: 720,
      maxHeight: 1280,
      quality: 1,
      // 允许选择多张
      // multiple: true, // 设置为true，可以选择多张图片
      selectionLimit:0
    };
    async function requestCameraPermission() {
      console.log("Platform.Version",Platform.Version)
      if (Platform.Version as number >= 31) {
        // 如果运行的是 Android 12 或更高版本，选用新模型来请求相机权限
        // const result = await requestPermissionAndroid12('android.permission.CAMERA');
        // 请求本地存储权限
        const result = await requestPermissionAndroid12('android.permission.READ_EXTERNAL_STORAGE')
        if (result === PermissionsAndroid.RESULTS.GRANTED) {
          console.log("加载权限")
          // launchCamera(options, (res)=>{
          //   console.log("res",res)
          // });
          //打开图库
          launchImageLibrary(options, ({assets})=>{
            console.log("res1111111111111111111111",assets)
            // res {"assets": [{"fileName": "rn_image_picker_lib_temp_00144087-1f0f-4d10-ae39-5ad9f2a02440.jpg", "fileSize": 232251, "height": 720, "type": "image/jpeg", "uri": "file:///data/user/0/com.xipai/cache/rn_image_picker_lib_temp_00144087-1f0f-4d10-ae39-5ad9f2a02440.jpg", "width": 720}]}
            if(assets) {
              setNewAddImages(assets)
            }
          });
          console.log('Camera permission granted权限通过');
        } else {
          console.log('Camera permission denied权限拒绝');
        }
      } else {
        // 如果运行的是 Android 11 或更低版本，使用之前的版本的权限请求模型来请求
        try {
          const granted = await PermissionsAndroid.request(
            // PermissionsAndroid.PERMISSIONS.CAMERA,
            PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
            {
              title: 'App android.permission.READ_EXTERNAL_STORAGE Permission',
              message: 'App needs access to android.permission.READ_EXTERNAL_STORAGE.',
              buttonNeutral: 'Ask Me Later',
              buttonNegative: 'Cancel',
              buttonPositive: 'OK',
            },
          );
          if (granted === PermissionsAndroid.RESULTS.GRANTED) {
            console.log('Camera permission granted,11一下权限请求通过');
          } else {
            console.log('Camera permission denied,11一下权限请求失败');
          }
        } catch (err) {
          console.warn(err);
        }
      }
    }
    async function requestPermissionAndroid12(permission:any) {
      // 检查是否该应用被永久允许了相机权限android.permission.CAMERA
      const isGranted = await PermissionsAndroid.check(permission);
      if (isGranted) {
        // 如果设置的应用权限管理中用户允许了，直接返回许可令
        return PermissionsAndroid.RESULTS.GRANTED;
      }
      // 询问用户是否给权限，如果用户设置的是每次使用时询问
      const result = await PermissionsAndroid.request(permission);
      if (result === PermissionsAndroid.RESULTS.GRANTED) {
        console.log("yunxu")
        return PermissionsAndroid.RESULTS.GRANTED;
      } else if (result === PermissionsAndroid.RESULTS.NEVER_ASK_AGAIN) {
        throw new Error('Permission denied with never ask again');
      } else {
        throw new Error('Permission denied');
      }
    }
    requestCameraPermission()
    
  }
  const hanldeDeleteImage = (id:string) => {
    console.log("删除图片",id);
    setWorkId(id);
    setModalVisiable1(true)
  }
  const handleDeleteNewImage = (fileName:string) => {
    console.log("删除新增的图片",fileName);
    setFileName(fileName);
    setDeleteNewImageVisiable(true);
  }
  return (
    <View style={{width: windowWidth}}>
      <View style={modalVisible ? styles.loginBox1 : styles.loginBox}>
        <ScrollView>
          <View style={styles.mainBox}>
            <Touchable style={styles.avatarBox} onPress={handleAddPicCheck}>
              {!image && (
                <IconFont
                  name="icon-jia"
                  size={30}
                  color={'#A75E5E'}></IconFont>
              )}
              {!image && <Text style={styles.avatar}>请上传头像</Text>}
              {image && <Image source={image} style={styles.avatarImage} />}
            </Touchable>
            <TextInput
              defaultValue={currentUser1 && currentUser1[0].username}
              onChangeText={text => onChangeText(text, 'username')}
              placeholder="请输入用户名"
              style={[styles.inputBox, styles.inputBoxTop]}></TextInput>
            <TextInput
              // 弹出纯数字键盘，但是用户依然可以切换键盘
              defaultValue={currentUser1 ? currentUser1[0].age?.toString() : ''}
              keyboardType="numeric"
              onChangeText={text => onChangeText(text, 'age')}
              placeholder="请输入年龄"
              style={styles.inputBox}></TextInput>
            <Touchable onPress={handlePressCity}>
              <Text style={[styles.inputBox, styles.inputBox1]}>
                {saveCity ? saveCity : '请选择常住城市'}
              </Text>
            </Touchable>
            <TextInput
              defaultValue={currentUser1 && currentUser1[0].nature}
              placeholder="请输入性格爱好"
              style={styles.inputBox}
              onChangeText={text => onChangeText(text, 'nature')}></TextInput>
            {
              // 摄影师会有摄影作品和摄影年限
              currentUser1 && currentUser1[0].identity === '摄影师' && (
                <View style={styles.pBox}>
                  <TextInput
                    defaultValue={
                      currentUser1 ? currentUser1[0].experience?.toString() : ''
                    }
                    placeholder="请输入摄影年限"
                    style={styles.inputBox}
                    onChangeText={text =>
                      onChangeText(text,'experience')
                    }></TextInput>
                  <View style={styles.myWorks}>
                    <Text style={styles.worksTitle}>我的作品：</Text>
                    <View style={styles.workBox}>
                        {works &&
                        works.length > 0 &&
                        works.map(i => {
                          return (
                            <Touchable style={styles.workimageItem} onLongPress={()=>{hanldeDeleteImage(i.work_id)}} key={i.work_id}>
                              <Image
                                source={{uri: i.work_url}}
                                style={styles.image3}
                              />
                            </Touchable>
                          );
                        })}
                        {newAddImages &&
                        newAddImages.length > 0 &&
                        newAddImages.map(i => {
                          return (
                            <Touchable style={styles.workimageItem} key={i.fileName} onLongPress={()=>{handleDeleteNewImage(i.fileName)}}>
                              <Image
                                source={{uri: i.uri}}
                                style={styles.image3}
                              />
                            </Touchable>
                          );
                        })}
                      <Touchable onPress={handlePickerImage}>
                        <Image
                          source={require('../../assets/localImage/add2.png')}
                          style={styles.addpng}></Image>
                      </Touchable>
                    </View>
                  </View>
                </View>
              )
            }
            <Touchable onPress={handleSubmit} style={styles.submit}>
              <Text style={styles.registerBtn}>提交</Text>
            </Touchable>
          </View>
        </ScrollView>
      </View>
      {modalVisible && (
        <View style={styles.centeredView}>
          <Tree
            modalVisible={modalVisible}
            setModalVisible={setModalVisible}
            setSaveCity={setSaveCity}></Tree>
        </View>
      )}
       {modalVisiable1 && (
        <Modal
          animationType="slide"
          transparent={true}
          visible={modalVisiable1}
          // onRequestClose回调会在用户按下 Android 设备上的后退按键或是 Apple TV 上的菜单键时触发。请务必注意本属性在 Android 平台上为必需，且会在 modal 处于开启状态时阻止BackHandler事件。
          onRequestClose={() => {
            Alert.alert('Modal has been closed.');
            setModalVisiable1(!modalVisiable1);
          }}>
          <View style={styles.centeredView1}>
            <View style={styles.modalView1}>
              <Text style={styles.modalText}>确定要移除图片么？</Text>
              <View style={styles.btn}>
                <TouchableHighlight
                  style={{...styles.openButton, backgroundColor: '#A75E5E'}}
                  onPress={() => {
                    // 直接关闭弹窗不做任何操作
                    setModalVisiable1(!modalVisiable1);
                  }}>
                  <Text style={styles.textStyle}>关闭</Text>
                </TouchableHighlight>

                <TouchableHighlight
                  style={{...styles.openButton, backgroundColor: '#A75E5E'}}
                  onPress={() => {
                    let newWorks = JSON.parse(JSON.stringify(works));
                    let newArr = newWorks.filter((i:any) => {
                      return i.work_id !== workId
                    });
                    console.log("newArr",newArr.length);
                    setWorks(newArr);
                    setModalVisiable1(false);
                  }}>
                  <Text style={styles.textStyle}>确定</Text>
                </TouchableHighlight>
              </View>
            </View>
          </View>
        </Modal>
      )}
        {deleteNewImageVisiable && (
        <Modal
          animationType="slide"
          transparent={true}
          visible={deleteNewImageVisiable}
          // onRequestClose回调会在用户按下 Android 设备上的后退按键或是 Apple TV 上的菜单键时触发。请务必注意本属性在 Android 平台上为必需，且会在 modal 处于开启状态时阻止BackHandler事件。
          onRequestClose={() => {
            Alert.alert('Modal has been closed.');
            setDeleteNewImageVisiable(deleteNewImageVisiable);
          }}>
          <View style={styles.centeredView1}>
            <View style={styles.modalView1}>
              <Text style={styles.modalText}>确定要移除图片么？</Text>
              <View style={styles.btn}>
                <TouchableHighlight
                  style={{...styles.openButton, backgroundColor: '#A75E5E'}}
                  onPress={() => {
                    // 直接关闭弹窗不做任何操作
                    setDeleteNewImageVisiable(!deleteNewImageVisiable);
                  }}>
                  <Text style={styles.textStyle}>关闭</Text>
                </TouchableHighlight>

                <TouchableHighlight
                  style={{...styles.openButton, backgroundColor: '#A75E5E'}}
                  onPress={() => {
                    let newWorks = JSON.parse(JSON.stringify(newAddImages));
                    let newArr = newWorks.filter((i:any) => {
                      return i.fileName !== fileName
                    });
                    console.log("newArr",newArr.length);
                    setNewAddImages(newArr);
                    setDeleteNewImageVisiable(false);
                  }}>
                  <Text style={styles.textStyle}>确定</Text>
                </TouchableHighlight>
              </View>
            </View>
          </View>
        </Modal>
      )}
    </View>
  );
};
const styles = StyleSheet.create({
  loginBox: {
    padding: 10,
    backgroundColor: '#fff',
    width: windowWidth,
    height: windowHeight,
  },
  loginBox1: {
    // padding: 10,
    backgroundColor: '#ccc',
    width: windowWidth,
    height: windowHeight,
  },
  mainBox: {
    matginTop: 10,
    display: 'flex',
    alignItems: 'center',
  },
  bigTitle: {
    fontSize: 70,
    fontWeight: '700',
    color: '#A75E5E',
  },
  image: {
    width: 200,
    height: 130,
    resizeMode: 'stretch',
    marginBottom: 10,
  },
  image1: {
    width: 150,
    height: 16,
    resizeMode: 'stretch',
  },
  image2: {
    width: 240,
    height: 18,
    resizeMode: 'stretch',
  },
  inputBox: {
    width: getWidth(80),
    height: 40,
    borderBottomColor: '#A75E5E',
    borderBottomWidth: 1,
  },
  inputBox1: {
    lineHeight: 40,
    color: '#999',
    paddingLeft: 2,
  },
  inputBoxTop: {
    marginTop: 20,
  },
  submit:{
    marginBottom:50,
  },
  registerBtn: {
    width: getWidth(50),
    height: 35,
    color: '#fff',
    textAlign: 'center',
    backgroundColor: '#A75E5E',
    marginVertical: 35,
    borderRadius: 35,
    lineHeight: 35,
  },
  centeredView: {
    flex: 1, // 占据了整个页面的宽度，让其子元素居中
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    marginTop: 50,
  },
  modalView: {
    width: getWidth(50),
    height: getHeight(90),
    backgroundColor: 'white',
    borderRadius: 10,
    padding: 35,
    alignItems: 'center',
    shadowColor: '#000',
    shadowOffset: {
      width: 0,
      height: 2,
    },
    shadowOpacity: 0.25,
    shadowRadius: 3.84,
    elevation: 5,
  },
  modalText: {
    marginBottom: 15,
    textAlign: 'center',
  },
  avatarBox: {
    width: windowWidth,
    // height:50,
    padding: 25,
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    flexDirection: 'row',
  },
  avatar: {
    color: '#999',
  },
  avatarImage: {
    width: 100,
    height: 100,
    borderRadius: 100,
  },
  pBox:{
    display:"flex",
    alignItems:"center"
  },
  myWorks:{
    width:"100%",
    paddingVertical:15,
  },
  workBox:{
    width:"100%",
    display:"flex",
    flexDirection:"row",
    flexWrap:"wrap",
  },
  worksTitle:{
    paddingBottom:5
  },
  workimageItem:{

  },
  image3:{
    width:100,
    height:100,
    margin:2,
    borderRadius:2
  },
  addpng:{
    width:100,
    height:100
  },
    // 弹窗的样式
    centeredView1: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      marginTop: 22,
    },
    modalView1: {
      width: getWidth(70),
      margin: 10,
      backgroundColor: '#F6F2F2',
      borderRadius: 10,
      padding: 20,
      alignItems: 'center',
      shadowColor: '#000',
      shadowOffset: {
        width: 5,
        height: 7,
      },
      shadowOpacity: 0.25,
      shadowRadius: 3.84,
      elevation: 5,
    },
  btn: {
    display: 'flex',
    flexDirection: 'row',
  },
  openButton: {
    backgroundColor: '#A75E5E',
    borderRadius: 15,
    paddingHorizontal: 10,
    paddingVertical: 5,
    marginHorizontal: 15,
    elevation: 2,
  },
  textStyle: {
    color: 'white',
    fontWeight: 'bold',
    textAlign: 'center',
  },
});
export default connector(Register);
